<template>
  <div>
    <ol>
      <li v-for="item in news" :key="item.id">
        <!-- 第一种写法：注意此处用绝对路径，to 要改成 v-bind 指令才能拼接 id -->
        <router-link :to="'/news-detail/' + item.id">
          {{ item.title }}
        </router-link>
      </li>
    </ol>
  </div>
</template> 
  </template>
  
  <script>
  export default {
    data() {
      return {
        news: [
          { id: 1, title: '欧洲杯-莱万替补无功中超旧将点射 奥地利3-1波兰' },
          { id: 2, title: '欧洲杯-乌克兰2-1逆转斯洛伐克 津琴科助攻铁腰传射' },
          { id: 3, title: '抽象的强强碰撞，格列兹曼终结堪比卢卡库！德尚没姆巴佩真' },
          { id: 4, title: '3-1欧洲杯首支出线队浮现!莱万难阻两连败,被中超旧将' },
        ]
      }
    }
  }
  </script>
  
  <style></style>